<template>
  <section class="appmain" :style="'top:'+appMainTop+'px'">
    <transition name="fade" mode="out-in">
      <!-- <router-view :key="key"></router-view> -->
      <router-view v-if="isRouterAlive"></router-view>
    </transition>
  </section>
</template>

<script>
  import { mapGetters } from 'vuex'

  export default {
    name: 'AppMain',
    provide() {
      return {
        reload: this.reload,
      }
    },
    computed: {
      ...mapGetters([
        'appMainTop',
      ]),
    },
    methods: {
      reload() {
        this.isRouterAlive = false
        this.$nextTick(() => {
          this.isRouterAlive = true
        })
      },
      GetNoticesList() {
        this.$store.dispatch('GetNoticesList')
          .then(response => {
            // 先关闭弹窗
            for (const key in response.data) {
              alert(response.data[key].content)
            }
          })
      },
    },
    created() {
      this.GetNoticesList()
    },
    data() {
      return {
        notices: '', // 公告
        isRouterAlive: true,
      }
    },
}
</script>
<style scoped>
  .appmain{
    width: 100%;
    bottom: 27px;
    /*height:100%;*/
    position: absolute;
    overflow-y: auto;
    top:80px;
    overflow-x: hidden;
  }
</style>
